<template>
    <div class="main">
        <div class="content" v-for="(item,index) in News_item" :key="index" :class="{content_last:index==2}">
            <div class="content_img" ><img :src="item.url" class="img_suit"></div>
            <div class="content_text">{{item.title}}</div>
            <div class="content_bottom">
                <div class="left">{{item.time}}</div>
                <div class="right">
                    <div style="display:inline-block"><img src="../../assets/watch.png"  alt="" width="25px"></div>
                    <div class="watch">{{item.watch}}</div>
                </div>
            </div>
        </div>

    </div>
</template>

<script>
export default {
    data(){
        return{
            News_item:[
                {
                  title:"2021年高考报名来了，考试需注意的这5大事项",
                  url: "https://s-p-internet.oss-cn-shenzhen.aliyuncs.com/1622366103430",
                  time:'2020-12-13',
                  watch:2345
                },
                {
                  title:"2021年高考报名来了，考试需注意的这5大事项",
                  url: "https://s-p-internet.oss-cn-shenzhen.aliyuncs.com/1622366103430",
                  time:'2020-12-13',
                  watch:2345
                },
                {
                  title:"2021年高考报名来了，考试需注意的这5大事项",
                  url: "https://s-p-internet.oss-cn-shenzhen.aliyuncs.com/1622366103430",
                  time:'2020-12-13',
                  watch:2345
                },
            ],
        }
    }
}
</script>

<style scoped>
.main{
    width: 1340px;
    height: 500px;
    margin: 0 auto;
    margin-top: 32px;
    padding-bottom: 20px;
}
.content{
    width: 410px;
    height: 475px;
    display: inline-block;
    margin-right: 50px;
    /* background-color: black; */
}
.content_last{
    margin-right: 0px;
}
.content_text{
    margin-top:32px;
    font-size: 26px;
    font-family: Noto Sans SC;
    font-weight: 400;
    line-height: 44px;
    color: #4D4D4D;
    text-align: left;
    margin-left:10px;
}
.content_text:hover{
    color: rgba(51, 170, 255, 1);
    cursor: pointer;
    transition-duration: 0.4s;
}
.content_bottom{
    margin-top:30px;
    margin-left: 10px;

}
.left{
    float: left;
    font-size: 18px;
    font-family: Noto Sans SC;
    font-weight: 400;
    line-height: 24px;
    color: #C3C3C3;
}
.right{
    margin-left: 310px;
    font-size: 18px;
    font-family: Noto Sans SC;
    font-weight: 400;
    line-height: 24px;
    color: #C3C3C3;
}
.watch{
    display: inline-block;
    position: relative;
    top: -5px;
    left: 8px;
}
.img_suit{
    width: 100%;
    height: 100%;
}
</style>